<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>First Static Web -- Heima Travil</title>
</head>
<body>
<!--最外层的table，用于整个页面的布局-->
<table align="center" width="100%"><!--cellspacing="1"-->
    <!--1. top banner-->
    <tr>
        <td>
            <img src="./image/top_banner.jpg" width="100%" alt="">
        </td>
    </tr>
    <!--2. -->
    <tr>
        <td>
            <!--嵌套表格, 方便填充元素-->
            <table align="center" width="100%">
                <tr><!--表格里的第一行, 其实就只有一行-->

                    <td><!--第一行里第一格-->
                        <img src="./image/logo.jpg"
                             width="207">
                    </td>
                    <td>
                        <img src="./image/search.png" align="center">
                    </td>
                    <td>
                        <img src="./image/hotel_tel.png">   <!--  width="100%" align="center"图片设置此处百分比大小, 并不是-->
                    </td>
                </tr>
            </table>
        </td>

    </tr>
    <!-- 3. 文字表格嵌套-->
    <tr>
        <td>
            <table align="center" width="100%"> <!--怎么设置高度? height//border="100" -->
                <tr bgcolor="#7fffd4" align="center" height="45">
                    <td><a href="https://www.youtube.com" target="_blank">首页</a></td>
                    <td><a href="https://www.twitter.com" target="_blank">reol</a></td>
                    <td><a href="https://www.ithome.com" target="_blank">之家</a></td>
                    <td><a href="https://www.github.com" target="_top">GayHub</a></td>
                    <td><a href="http://www.dilidili.wang" target="_parent">嘀哩</a></td>
                    <td><a href="https://www.bilibili.com" target="_blank">哔哩</a></td>
                </tr>
            </table>
        </td>
    </tr>
    <!-- 4. 图片-->
    <tr>
        <td><img src="./image/banner_3.jpg" width="100%"><!--缺少--></td>
    </tr>
    <!-- 5. -->
    <tr>
        <td><img src="./image/icon_5.jpg"><i>黑马精选</i>
            <hr color="yellow" height="200">
        </td>
    </tr>
    <!-- 6. -->
    <tr>
        <td>
            <table align="center" width="100%">
                <tr>
                    <td>
                        <img src="./image/jiangxuan_1.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        &yen;<font color="red">899</font>
                    </td>
                    <td>
                        <img src="./image/jiangxuan_1.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        &yen;<font color="red">899</font>
                    </td>
                    <td>
                        <img src="./image/jiangxuan_1.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        &yen;<font color="red">899</font>
                    </td>
                    <td>
                        <img src="./image/jiangxuan_1.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="red">&yen;899</font>
                    </td>
                </tr>
            </table>
        </td>

    </tr>
    <!-- 7. -->
    <tr>
        <td>
            <img src="image/icon_6.jpg">国内游
            <hr color="#fe4387">
        </td>
    </tr>
    <!-- 8. -->
    <tr>
        <td>
            <table width="100%" align="center">
                <tr>
                    <td rowspan="2" width="100%">
                        <img src="image/guonei_1.jpg">
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_2.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_2.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_2.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                </tr>
                <tr align="center">
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_2.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_2.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_2.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                </tr>
            </table>
        </td>
    </tr>


    <!-- 9. -->
    <tr>
        <td>
            <img src="image/icon_7.jpg">境外游
            <hr color="#32ef23">
        </td>
    </tr>
    <!-- 10. -->
    <tr>
        <td>
            <table width="100%" align="center">
                <tr><!--width="100%" 多了-->
                    <td rowspan="2">
                        <img src="image/jiangwai_1.jpg">
                    </td>
                    <td>
                        <img src="image/jiangxuan_3.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_3.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>

                    <td width="100%">
                        <img src="image/jiangxuan_3.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                </tr>

                    <!--/<td>-->
                <tr align="center">
                    <td width="100%">
                        <img src="image/jiangxuan_3.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_3.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                    <td width="100%">
                        <img src="image/jiangxuan_3.jpg">
                        <p>上海直飞三亚5天4晚自由行(春节预售+蜜月/休闲游首选 + 豪华酒店任选 + 接送机)</p>
                        <font color="#7cfc00">&yen;699</font>
                    </td>
                </tr>
            </table>
        </td>

    </tr>
    <!-- 11.-->
    <tr align="center">
        <td>
            <img src="image/footer_service.png">
        </td>
    </tr>

    <!-- 12. -->
    <tr><!-- align="center" 多了-->
        <td align="center" bgcolor="#adff2f" height="50">     <!-- 在 td 此处设置背景色!-->
            <font color="#544232" size="1">
                江苏传智播客教育科技股份有限公司
                版权所有Copyright 2006-2018&copy;, All Rights Reserved 苏ICP备16007882
            </font>
        </td>
    </tr>

    <hr>

    <tr>
        <td align="center" bgcolor="#ffd700" height="40">
            <font color="gray" size="2">
                江苏传智播客教育科技股份有限公司
                版权所有Copyright 2006-2018&copy;, All Rights Reserved 苏ICP备16007882
            </font>
        </td>
    </tr>

</table>

</body>
</html>